<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../css/style.css">
  <link rel="stylesheet" href="../css/destination.css">
  <script src="https://map.qq.com/api/gljs?v=1.exp&key=TGHBZ-MEW6V-J72PB-5NW4L-WFJIV-HZBJH"></script>
  <title>后台管理系统</title>
</head>
<body>
  <div class="container">

    <div class="leftMenu">
      <div class="userAvatar">
        <img src="http://localhost:8080/upload/getImgByPath/1685625402999.jpg" alt="用户头像">
        <p id="accountName"></p>
        <p>超级管理员</p>
      </div>
      <a href="../index.html" class="selectMenuItem">
        主页
        <p class="dataCenterPage">数据中心</p>
      </a>
      <a  href="./tables.html" class="selectMenuItem">
        表格
        <p class="tablePage">订单内容</p>
      </a>
      <a href="./destination.html" class="selectMenuItem active">
        地图
        <p class="mapPage">工作室位置</p>
      </a>
    </div>

    <div class="rightContent">

      <div class="navBanner">
        <h2>欢迎进入后台管理系统</h2>
        <p id="outLogin">退出</p>
      </div>

      <div class="mapContainer"></div>
      
    </div>
  </div>

  
  <script src="../js/mapContainer.js"></script>
  <script>
    window.onload = function() {
      if (!localStorage.getItem('username') &&  !localStorage.getItem('password')) {
        window.location.href="./login.html";
      }
    }
    initMap();

    const accountName = document.getElementById('accountName');
    const outLogin = document.getElementById('outLogin');
    
    accountName.innerHTML = localStorage.getItem('username');
    
    outLogin.addEventListener('click', () => {
      const msg = "是否退出登录？";
      if (confirm(msg) == true) {
        localStorage.removeItem('username');
        localStorage.removeItem('password');
        
        window.location.href="./login.html";
        return true;
      }
    })
  </script>
  
</body>
</html>